const fs = require('fs');
const { createCanvas } = require('canvas');

// Function to create rounded rectangle path
function roundedRect(ctx, x, y, width, height, radius) {
    ctx.beginPath();
    ctx.moveTo(x + radius, y);
    ctx.lineTo(x + width - radius, y);
    ctx.quadraticCurveTo(x + width, y, x + width, y + radius);
    ctx.lineTo(x + width, y + height - radius);
    ctx.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
    ctx.lineTo(x + radius, y + height);
    ctx.quadraticCurveTo(x, y + height, x, y + height - radius);
    ctx.lineTo(x, y + radius);
    ctx.quadraticCurveTo(x, y, x + radius, y);
    ctx.closePath();
}

// Function to draw heart shape
function drawHeart(ctx, x, y, size) {
    ctx.beginPath();
    const topCurveHeight = size * 0.3;
    
    // Left curve
    ctx.moveTo(x, y + topCurveHeight);
    ctx.bezierCurveTo(x, y, x - size / 2, y, x - size / 2, y + topCurveHeight);
    ctx.bezierCurveTo(x - size / 2, y + (topCurveHeight + size) / 2, x, y + (topCurveHeight + size) / 2, x, y + size);
    
    // Right curve
    ctx.bezierCurveTo(x, y + (topCurveHeight + size) / 2, x + size / 2, y + (topCurveHeight + size) / 2, x + size / 2, y + topCurveHeight);
    ctx.bezierCurveTo(x + size / 2, y, x, y, x, y + topCurveHeight);
    
    ctx.fill();
}

// Function to create app icon
function createAppIcon(size) {
    const canvas = createCanvas(size, size);
    const ctx = canvas.getContext('2d');
    
    // Create gradient background
    const gradient = ctx.createLinearGradient(0, 0, size, size);
    gradient.addColorStop(0, '#ff9a9e');
    gradient.addColorStop(0.3, '#fecfef');
    gradient.addColorStop(0.7, '#ff6b9d');
    gradient.addColorStop(1, '#c44184');
    
    // Draw rounded rectangle background
    const radius = size * 0.15;
    ctx.fillStyle = gradient;
    roundedRect(ctx, 0, 0, size, size, radius);
    ctx.fill();
    
    // Add overlay pattern
    const overlayGradient = ctx.createRadialGradient(size/2, size/2, 0, size/2, size/2, size/2);
    overlayGradient.addColorStop(0, 'rgba(255, 255, 255, 0.3)');
    overlayGradient.addColorStop(0.7, 'rgba(255, 255, 255, 0.1)');
    overlayGradient.addColorStop(1, 'rgba(255, 182, 193, 0.2)');
    
    ctx.fillStyle = overlayGradient;
    roundedRect(ctx, 0, 0, size, size, radius);
    ctx.fill();
    
    // Draw heart symbol
    const heartSize = size * 0.4;
    const heartX = size / 2;
    const heartY = size / 2 - size * 0.05;
    
    ctx.fillStyle = '#ffffff';
    ctx.shadowColor = 'rgba(0, 0, 0, 0.2)';
    ctx.shadowBlur = size * 0.02;
    ctx.shadowOffsetY = size * 0.01;
    
    drawHeart(ctx, heartX, heartY, heartSize);
    
    // Reset shadow
    ctx.shadowColor = 'transparent';
    ctx.shadowBlur = 0;
    ctx.shadowOffsetY = 0;
    
    // Draw text "墨轩"
    const fontSize = size * 0.12;
    ctx.font = `bold ${fontSize}px Arial`;
    ctx.fillStyle = '#ffffff';
    ctx.textAlign = 'center';
    ctx.textBaseline = 'middle';
    
    // Add text shadow
    ctx.shadowColor = 'rgba(0, 0, 0, 0.3)';
    ctx.shadowBlur = size * 0.01;
    ctx.shadowOffsetY = size * 0.005;
    
    ctx.fillText('墨轩', size / 2, size - size * 0.18);
    
    return canvas;
}

// Generate icons for different sizes
const sizes = [57, 72, 114, 144, 192, 512];

console.log('Generating app icons for 墨轩...');

sizes.forEach(size => {
    try {
        const canvas = createAppIcon(size);
        const buffer = canvas.toBuffer('image/png');
        const filename = `static/moxuan_icon_${size}x${size}.png`;
        fs.writeFileSync(filename, buffer);
        console.log(`Generated: ${filename}`);
    } catch (error) {
        console.log(`Could not generate ${size}x${size} icon: ${error.message}`);
    }
});

console.log('Icon generation complete!');
console.log('Note: If canvas module is not available, please use the HTML generator instead.');